﻿var chartData;


//to show graph
function ShowGraph(bGetData) {

    //debugger;
    var dimtable_name = $("#drp_mstdash option:selected").data("TableName");
    var list_id = $("#drp_mstdash").val();
    //var charttype = $("#drp_chart").val();
    var charttype = $('input:radio[name=radiogrp_chart]:checked').val();
    var chartfield = $('input:radio[name=radiogrp_chfield]:checked').val(); 

    //alert(charttype);
    //    if ($("#drp_chart option:selected").val() == "") {
    //        alert("Please Select Chart Type !");
    //        return false;
    //    }

    if ($("#drp_mstdash option:selected").val() == "") {
        //alert("Please Select Dimension !");
        return false;
    }
    else {

        if (bGetData == true) {
            $.ajax({
                async: true,
                type: 'POST',
                url: "DashboardCallback.aspx?operation=get_data&dimtable_name=" + dimtable_name + "&list_id=" + list_id + "&charttype=" + charttype + "&chartfield=" + chartfield,
                success: function (str) {
                    //debugger;
                    var data = eval('(' + str + ')');
                    chartData = data;
                    getChartObject(charttype, data);
                }
            });
        }
        else {

            getChartObject(charttype, chartData);
        }
   }

}


function getChartObject(charttype, data) {
    debugger; //['Alabama', 17],

    $("#chartdiv").empty();

    if (charttype == "pie") {

        var obj = "[";
        $.each(data, function (key, item) {
            //debugger;
            obj = obj + "['" + key + "'," + data[key] + "],";
        });

        obj = obj.substring(0, obj.length - 1);
        obj = obj + "]";

        plotPieChart(obj);

    }

    if (charttype == "bar") {
        var ticks = "[";
        var cnt = "[";

        $.each(data, function (key, item) {
            //debugger;
            ticks = ticks + "'" + key + "'," ;
            cnt = cnt + data[key] + ",";

        });

        ticks = ticks.substring(0, ticks.length - 1);
        cnt = cnt.substring(0, cnt.length - 1);

        ticks = ticks + "]";
        cnt = cnt + "]";

        plotBarChart(ticks, cnt);
    }
    
   // debugger;

}

function plotPieChart(str) {

    var listname = $("#drp_mstdash option:selected").text();
    var chartfield = $('input:radio[name=radiogrp_chfield]:checked').val();
    var title = chartfield + " in " + listname;
//    data = [
//                    ['Alabama', 17], ['Cupertino', 18], ['Denver', 18],
//                                    ['Kansas City', 7], ['Los Angeles', 13], ['Ohio', 12],
//                       ['Persistance', 12], ['Salt Lake City', 14], ['San Francisco', 6]// ,
//    //                                    ['San Jose', 14], ['San Mateo', 14], ['Santa Fe', 14],
//    //                                    ['Santa Monica', 11], ['St. Petersburg', 15], ['Sunnyvale', 15]
//                  ];

    var data = eval('(' + str + ')');

   // debugger;

    var plot1 = jQuery.jqplot('chartdiv', [data],
    {
        seriesDefaults: {
            // Make this a pie chart.
            renderer: jQuery.jqplot.PieRenderer,
            rendererOptions: {
                // Put data labels on the pie slices.
                // By default, labels show the percentage of the slice.
                showDataLabels: true,

                dataLabels: 'percent'//, // 'percent' / 'value' / 'label'
                //dataLabelFormatString: ['%d', ('%d%%')], 

            }//,
            //pointLabels: { show: true } 
        },
        legend: { show: true, location: 'e' },
        //title: 'City In Contacts'
        title: title
    }
    );
}


function plotBarChart(ticks,cnt) {

    //debugger;

    var ticks = eval('(' + ticks + ')');
    var cnt = eval('(' + cnt + ')');
    var listname = $("#drp_mstdash option:selected").text();
    var chartfield = $('input:radio[name=radiogrp_chfield]:checked').val();
    var title = chartfield + " in " + listname;

    var plot1 = $.jqplot('chartdiv', [cnt], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults: {
            renderer: $.jqplot.BarRenderer,
            rendererOptions: { fillToZero: true, barWidth: 25 },
            pointLabels: { show: true } 
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.

        series: [
            //{ label: 'City'}//,
            {label: chartfield}//,
        //            { label: 'Event Regristration' },
        //            { label: 'Airfare' }
            ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid'
        },
        axesDefaults: {
            tickRenderer: $.jqplot.CanvasAxisTickRenderer,
            tickOptions: {
                angle: -30,
                fontSize: '10pt',
                showLabel: true
            }
        },
        //showTickMarks: true,
       // stackSeries: true, 
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                ticks: ticks
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 1.05,
                tickOptions: { formatString: '%d' }
            }
        },
       // title: 'City In Contacts'
        //title: 'City In Contacts'
        title: title//  ,
//        legend: {
//            show: true,
//            location: 'e',
//            placement: 'outside'
//        }    
    });
}